import { Mentions, Form, Button ,Input,message} from 'antd';
import { FormattedMessage, formatMessage } from 'umi-plugin-react/locale';
import { connect } from 'dva';
import  Result from './Result';
import router from 'umi/router';
import styles from './index.less';

	
const { TextArea } = Input;


const { Option, getMentions } = Mentions;

@connect(({ create, loading }) => ({
  create,
  submit: loading.effects['create/submit'],
}))

class App extends React.Component {


  state = {
    count: 0,
    confirmDirty: false,
    visible: false,
    help: '',
    prefix: '86',
  };
  handleReset = e => {
    e.preventDefault();
    this.props.form.resetFields();
  };
  handleSubmit1 = e => {
    e.preventDefault();
    console.log('Submit1!!!');

    this.props.form.validateFields((errors, values) => {
      if (errors) {
        console.log('Errors in the form!!!');
        return;
      }
      console.log('Submit!!!');
      console.log(values);
    });
  };


handleSubmit = e => {
    e.preventDefault();
    const { form, dispatch } = this.props;

    form.validateFields(
      {
        force: true,
      },
      (err, values) => {
        console.log(values)
        const  payload  = { "image" : values }
        console.log(payload)
        if (!err) {
          const { prefix } = this.state;
          dispatch({
            type: 'create/submit',
            payload: payload,
/*            callback: (res) => {
                if (res) {
                    console.log(res);// 请求完成后返回的结果
                }
            }*/
          })
          .then(result => {
           console.log('Tags result', result); 
           const {status} = result;
           if(status === "ok"){
              message.success('创建成功！');
              router.push({
                pathname: '/result',

            });

           }else{
              message.success('创建fail！');
           }
         });
        }
      },
    );
  };

  checkMention = (rule, value, callback) => {

  };

  render() {
        const { submitting } = this.props;

    const {
      form: { getFieldDecorator },
    } = this.props;

    return (
      <div className = {styles.title}>
      <div className = {styles.tail}>
      <Form layout="horizontal" onSubmit={this.handleSubmit}>
        <Form.Item label="name" labelCol={{ span: 6 }} wrapperCol={{ span: 16 }}>
          {getFieldDecorator('name')(
              <Input
                size="large"

              />,
            )}
        </Form.Item>

        <Form.Item label="description" labelCol={{ span: 6 }} wrapperCol={{ span: 16 }}>
          {getFieldDecorator('description')(
            <TextArea rows={14} />,
          )}
        </Form.Item>
        <Form.Item label="url " labelCol={{ span: 6 }} wrapperCol={{ span: 16 }}>
          {getFieldDecorator('url')(
            <Input
                size="large"

              />,
          )}
        </Form.Item>
        <Form.Item wrapperCol={{ span: 14, offset: 6 }}>
          <Button type="primary" onClick={this.handleSubmit} htmlType="submit" >
            Submit
          </Button>
          &nbsp;&nbsp;&nbsp;
          <Button onClick={this.handleReset}>Reset</Button>
 {/*                    <Button
              size="large"
              loading={submitting}
              className={styles.submit}
              type="primary"
              htmlType="submit"
            >
              <FormattedMessage id="useranduserregister.register.register" />
            </Button>*/}
        </Form.Item>

      </Form>
      </div>
      </div>
    );
  }
}


export default Form.create()(App);